<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>编辑员工</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="/layui/css/layui.css" rel="stylesheet">
    <style>
        .layui-form {
            margin: 20px;
        }
    </style>
</head>
<body>
    <form class="layui-form" lay-filter="employeeForm">
        <input type="hidden" name="id">
        <div class="layui-form-item">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-block">
                <input type="text" name="name" required lay-verify="required" 
                       placeholder="请输入姓名" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">性别</label>
            <div class="layui-input-block">
                <input type="radio" name="sex" value="男" title="男">
                <input type="radio" name="sex" value="女" title="女">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">年龄</label>
            <div class="layui-input-block">
                <input type="number" name="age" required lay-verify="required|number" 
                       placeholder="请输入年龄" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">电话</label>
            <div class="layui-input-block">
                <input type="text" name="tel" required lay-verify="required|phone" 
                       placeholder="请输入电话" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">地址</label>
            <div class="layui-input-block">
                <input type="text" name="address" required lay-verify="required" 
                       placeholder="请输入地址" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">职位</label>
            <div class="layui-input-block">
                <select name="position" lay-verify="required">
                    <option value="">请选择职位</option>
                    <option value="店长">店长</option>
                    <option value="销售员">销售员</option>
                    <option value="采购员">采购员</option>
                    <option value="仓管员">仓管员</option>
                </select>
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
                <input type="radio" name="status" value="1" title="在职">
                <input type="radio" name="status" value="0" title="离职">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="employeeForm">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>

    <script src="/layui/layui.js"></script>
    <script>
        layui.use(['form', 'layer'], function(){
            var form = layui.form;
            var layer = layui.layer;
            var $ = layui.jquery;

            // 获取员工ID
            var id = location.search.match(/id=(\d+)/)[1];

            // 加载员工信息
            $.ajax({
                url: '/employee/' + id,
                type: 'GET',
                success: function(res){
                    if(res.code === 0){
                        form.val('employeeForm', res.data);
                    } else {
                        layer.msg(res.msg || '加载失败', {icon: 2});
                    }
                }
            });

            // 表单提交
            form.on('submit(employeeForm)', function(data){
                $.ajax({
                    url: '/employee/update',
                    type: 'PUT',
                    contentType: 'application/json',
                    data: JSON.stringify(data.field),
                    success: function(res){
                        if(res.code === 0){
                            layer.msg('更新成功', {
                                icon: 1,
                                time: 2000
                            }, function(){
                                // 关闭当前iframe层
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(index);
                            });
                        } else {
                            layer.msg(res.msg || '更新失败', {icon: 2});
                        }
                    }
                });
                return false;
            });
        });
    </script>
</body>
</html> 